// 活动列表
<template>
    <div>
        <Row class="page">
            <Col span="24">
            <Button type="primary" icon="plus-round" @click="modal1 = true">新增活动</Button>
            <Modal v-model="modal1" title="新增活动" @on-ok="ok" @on-cancel="cancel" >
                 <Form ref="formValidate" :model="formValidate"  :label-width="100">
        <FormItem label="活动名称" prop="name">
            <Input v-model="formValidate.workName" placeholder="活动名称"></Input>
        </FormItem>
        <FormItem label="拼团价格" prop="mail">
            <Input v-model="formValidate.workInfo" placeholder="拼团价格"></Input>
        </FormItem>
                <FormItem label="拼团人数" prop="mail">
            <Input v-model="formValidate.workInfo" placeholder="拼团人数"></Input>
        </FormItem>
        <FormItem label="选择分类" prop="city">
            <Select v-model="list.name" placeholder="请选择分类">
                <Option value="beijing" v-for="item in list">{{item.name}}</Option>
            </Select>
        </FormItem>
    </Form>
            </Modal>
            </Col>
        </Row>
        <br>
        <Row class="page">
            <Col span="24">
            <Table border :columns="columns7" :data="data6"></Table>
            </Col>
        </Row>
    </div>
</template>

<script type="text/ecmascript-6">
export default {
  data() {
    return {
        list:[
{'name':'1'},
{'name':'2'}
        ],
      index: 1,
      formDynamic: {
        items: [
          {
            name: "",
            number: 0,
            name: "",
            number: "",
            price: "",
            group_price: "",
            index: 1,
            status: 1
          }
        ]
      },
      formValidate: {
        workName: "",
        workInfo: "",
        workClass: [],
        thumbnail: "",
        DisplayImg: [],
        detailsImg: ""
      },
      modal1: false,
      columns7: [
        {
          title: "活动名称",
          key: "flmc",
          render: (h, params) => {
            return h("div", [h("strong", params.row.name)]);
          }
        },
        {
          title: "活动时间",
          key: "spsl"
        },
        {
            title:"商品库存",
            key:"number"
        },
        {
          title: "操作",
          key: "caozuo",
          width: 150,
          align: "center",
          render: (h, params) => {
            return h("div", [
              h(
                "Button",
                {
                  props: {
                    type: "error",
                    size: "small"
                  },
                  on: {
                    click: () => {
                      this.remove(params.index);
                    }
                  }
                },
                "删除"
              ),h(
                  "Button",{
                      style:{
marginLeft:'10px'
                      },
                      props:{
                          type:"primary",
                          size:"small"
                      },
                      on:{
                          click:()=>{
                              console.log("s")
                          }
                      }
                  },
                  "编辑"
              )
            ]);
          }
        }
      ],
      data6: [
        {
          name: "John Brown",
          spsl: 18,
          number:22
        }
      ],
      value: ""
    };
  },
  methods: {
    handleAdd() {
      this.index++;
      this.formDynamic.items.push({
        value: "",
        index: this.index,
        status: 1
      });
    },
    ok() {
        console.log(this.formValidate,this.formDynamic,this.list)
    //   this.$Message.info("Clicked ok");
    //   this.data6.push({ name: this.value, spsl: "0" });
    },
    cancel() {
      this.$Message.info("Clicked cancel");
    },
    remove(index) {
      this.data6.splice(index, 1);
    },
    handleSubmit(name) {
      console.log(name);
      this.$refs[name].validate(valid => {
        if (valid) {
          this.$Message.success("Success!");
        } else {
          this.$Message.error("Fail!");
        }
      });
    },
    handleReset(name) {
      this.$refs[name].resetFields();
    }
  }
};
</script>

<style scoped>
</style>
